<style>
    #contentDataForm .layui-form-label {
        width: 70px !important;
    }

    .upLoad {
        height: 60px;
        cursor: pointer;
    }
</style>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card-body">
        <form class="layui-form bg-white" id="contentDataForm" lay-filter="contentDataForm">
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <input type="hidden" name="id">
                    <div class="layui-form-item">
                        <label class="layui-form-label layui-form-required">标题</label>
                        <div class="layui-input-block">
                            <input name="title" class="layui-input" lay-verType="tips" lay-verify="required"
                                   required/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label layui-form-required">分类:</label>
                        <div class="layui-input-block">
                            <div id="content_cate_id" class="ew-xmselect-tree"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label layui-form-required">描述</label>
                        <div class="layui-input-block">
                            <input name="remark" class="layui-input" lay-verType="tips" lay-verify="required"
                                   required/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label layui-form-required">封面图</label>
                        <div class="layui-input-block">
                            <div class="upLoad" id="chooseFile">
                                <img src="assets/images/uploads.png"
                                     style="height: 60px">
                                <input type="hidden" name="images" lay-verType="tips" lay-verify="required" required>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label layui-form-required">内容</label>
                        <div class="layui-input-block">
                            <textarea id="content" name="content" class="layui-hide"></textarea>
                        </div>
                    </div>
                    <div class="layui-form-item text-right">
                        <button class="layui-btn" lay-filter="contentSubmit" lay-submit>保存</button>
                        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<!-- js部分 -->
<script>
    layui.use(['layer', 'form', 'admin', 'setter', 'table', 'fileChoose', 'layedit', 'xmSelect', 'notice'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            form = layui.form,
            admin = layui.admin,
            setter = layui.setter,
            layedit = layui.layedit,
            xmSelect = layui.xmSelect,
            notice = layui.notice,
            fileChoose = layui.fileChoose;
        form.render();
        var tableData = admin.getLayerData('#contentDataForm');
        // 回显数据到form表单里面
        form.val('contentDataForm', tableData);
        if (tableData.opType == 'edit') {
            $('#chooseFile').children('input').val(tableData.images);
            $('#chooseFile').children('img').attr('src', tableData.images);
        }
        //建立编辑器
        layedit.set({
            uploadImage: {
                url: setter.baseServer + "/common/upLoad_image" //接口url
            }
        });
        var index = layedit.build('content');
        // 渲染分类下拉
        xmSelect.render({
            el: '#content_cate_id',
            data: tableData.categoryList,
            name: 'cate_id',
            value: 'id',
            hint: '选择内容分类',
            initValue: tableData.opType == 'edit' ? [tableData.cate_id] : [],
            radio: true,
            layVerify: 'required',
            layVerType: 'tips'
        });
        //图片上传
        $('#chooseFile').click(function () {
            var that = this;
            fileChoose.open({
                onChoose: function (urls) {
                    $(that).children('input').val(urls[0].url);
                    $(that).children('img').attr('src', urls[0].url)
                },
            });
        });
        /* 表单提交事件 */
        form.on('submit(contentSubmit)', function (data) {
            data.field.content=layedit.getContent(index)//取出编辑器内容
            layer.load(2);
            var url = tableData.opType == 'add' ? setter.baseServer + '/content/content_add' : setter.baseServer + '/content/content_edit';
            admin.req(url, data.field, function (res) {
                layer.closeAll('loading');
                if (200 === res.code) {
                    notice.msg(res.msg, {icon: 1});
                    admin.closeDialog('#contentDataForm');  // 关闭页面层弹窗
                } else {
                    notice.msg(res.msg, {icon: 2});
                }
            }, 'post');
            return false;
        });

    });
</script>
